<script setup>
import { useRouter } from 'vue-router/composables'
const props = defineProps({
  detailData: {
    type: Object,
    default: () => {
      return {
        project: {
          projectNo: ''
        }
      }
    }
  }
})
const router = useRouter()
const jumpToDetail = () => {
  router.push({
    path: '/wisdomConstruction/messageManagement/form',
    query: {
      pkid: props.detailData.project.pkid,
      isView: true,
      isCheck: false,
      title: '查看'
    }
  })
}
</script>
<template>
  <div class="base-info">
    <div class="base-info-item">
      <div class="base-info-item-desc">项目编号：</div>
      <div
        class="base-info-item-content"
        v-if="
          detailData &&
          detailData.project &&
          detailData.project.projectNo
        "
      >
        {{ detailData.project.projectNo }}
      </div>
    </div>
    <div class="base-info-item">
      <div class="base-info-item-desc">项目名称：</div>
      <div
        class="base-info-item-content"
        v-if="
          detailData &&
          detailData.project &&
          detailData.project.projectName
        "
      >
        {{ detailData.project.projectName }}
      </div>
    </div>
    <div class="base-info-item">
      <div class="base-info-item-desc">建设周期：</div>
      <div
        class="base-info-item-content"
        v-if="
          detailData &&
          detailData.project &&
          detailData.project.jszq
        "
      >
        {{
          detailData.project.jszq ||
          detailData.project.jszq !== ''
            ? JSON.parse(detailData.project.jszq)[0] +
              '-' +
              JSON.parse(detailData.project.jszq)[1]
            : ''
        }}
      </div>
    </div>
    <!-- <div class="base-info-item">
      <div class="base-info-item-desc">建设规模：</div>
      <div class="base-info-item-content">
        {{ detailData.project.jsgm }}
      </div>
    </div> -->
    <div class="base-info-item">
      <div class="base-info-item-desc">总投资：</div>
      <div
        class="base-info-item-content"
        v-if="
          detailData &&
          detailData.project &&
          detailData.project.ztz
        "
      >
        {{
          detailData.project.ztz
            ? detailData.project.ztz + '万元'
            : ''
        }}
      </div>
    </div>
    <div class="base-info-link" @click="jumpToDetail">
      项目详情 >
    </div>
  </div>
</template>

<style lang="scss" scoped>
.base-info {
  width: 100%;
  height: 60px;
  background: #f8f8f8;
  padding: 0 34px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  &-item {
    display: flex;
    &-desc {
      font-size: 16px;
      color: #000;
    }
    &-content {
      font-size: 16px;
      color: #4c565c;
    }
  }
  &-link {
    font-size: 14px;
    color: #00baff;
    cursor: pointer;
  }
}
</style>
